<template>

  <a-drawer
    :title="title"
    placement="right"
    :closable="true"
    :width="width"
    :visible="visible"
    @close="handleCancel"
    destroyOnClose
  >
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row :gutter="24">
          <a-col :span="24">
            <a-form-model-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerName">
              <a-input v-model="model.workerName" placeholder="请输入姓名"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerSex">
              <j-dict-select-tag
                placeholder="请输入性别"
                dictCode="sex"
                v-model="model.workerSex"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="工种" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerType">
              <a-select v-model="model.workerType">
                <a-select-option v-for="(item,index) in this.kindOfWorkList" :key="index" :value="item.id">{{item.kindOfWork}}
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerPhone">
              <a-input-number v-model="model.workerPhone" placeholder="请输入手机号" style="width: 100%"></a-input-number>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="身份证" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerIdCard">
              <a-input v-model="model.workerIdCard" placeholder="请输入身份证"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="籍贯" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workerNativePlace">
              <a-input v-model="model.workerNativePlace" placeholder="请输入籍贯"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remarks">
              <a-textarea v-model="model.remarks" placeholder="请输入备注" :auto-size="{ minRows: 3, maxRows: 4 }"/>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>

    <a-button type="primary" style="width: 100%" @click="handleOk">保存</a-button>

  </a-drawer>

</template>

<script>

  import {httpAction, getAction} from '@/api/manage'

  export default {
    name: 'GhWorkerInfoModal',
    data () {
      return {
        title:'',
        width: '100%',
        visible: false,
        disableSubmit: false,
        model: {},
        oldModel:{},
        labelCol: {
          xs: {span: 24},
          sm: {span: 5},
        },
        wrapperCol: {
          xs: {span: 24},
          sm: {span: 16},
        },
        confirmLoading: false,
        validatorRules: {
          workerName: [{ required: true, message: '工人姓名不能为空' }],
          workerType: [{ required: true, message: '工种不能为空' }],
          workerPhone: [{ required: true, message: '手机号不能为空' }],
          /*workerIdCard: [{ required: true, message: '身份证号不能为空' }]*/
        },
        kindOfWorkList:[],
        url: {
          add: "/GhWorkerInfo/add",
          edit: "/GhWorkerInfo/edit",
          queryById: "/GhWorkerInfo/queryById",
          kindOfWorkListUrl: "/ghKindOfWork/queryList"
        }
      }
    },
    computed: {
      formDisabled() {
        return this.disabled
      },
    },
    created() {
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
      this.loadKindOfWorkData();
    },
    methods: {
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            if (!this.validatePhone(this.model.workerPhone)){
              return false
            }
            /*if (!this.validateWorkerIdCard(this.model.workerIdCard)){
              return false;
            }*/
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if (!this.model.id) {
              httpurl += this.url.add;
              method = 'post';
            } else {
              httpurl += this.url.edit;
              method = 'put';
            }
            let params = [];
            params.push(this.model);  //这是更新之后的数据
            if (this.model.id){
              params.push(this.oldModel); //这是更新前的数据
            }
            httpAction(httpurl, params, method).then((res) => {
              if (res.success) {
                that.$message.success(res.message);
                that.$emit('ok');
              } else {
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.close();
              that.confirmLoading = false;
            })
          }

        })
      },
      submitCallback(){
        this.$emit('ok');
        this.visible = false;
      },
      handleCancel () {
        this.close()
      },
      add() {
        this.edit(this.modelDefault);
      },
      edit(record) {
        this.model = Object.assign({}, record);
        this.oldModel = Object.assign({}, record);
        this.visible = true;
      },
      loadKindOfWorkData(){
        getAction(this.url.kindOfWorkListUrl).then((res) => {
          if (res.success) {
            this.kindOfWorkList = res.result;
          }
        })
      },
      validatePhone(value){
        let regs = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;// 11位手机
        if (!regs.test(value)) {
          this.$message.error("手机号码格式不正确，请重新输入");
          return false;
        }else {
          return true;
        }
      },
      /*validateWorkerIdCard(rule, value, callback){
        if(!value){
          callback()
        }else{
          if(new RegExp(/^1[3|4|5|6|7|8|9][0-9]\d{8}$/).test(value)){
            let params = {
              tableName: 'gh_customer_info',
              fieldName: 'phone',
              fieldVal: value,
              dataId: this.customerId,
            };
            duplicateCheck(params).then((res) => {
              if (res.success) {
                callback()
              } else {
                callback("手机号已存在!")
              }
            })
          }else{
            callback("请输入正确格式的手机号码!");
          }
        }
      },*/
      /*validateWorkerIdCard(value){
        const regPsidno = /^\d{17}\w{1}$/
        if (!regPsidno.test(value)) {
          this.$message.error("身份证号长度输入有误，请重新输入");
          return false
        }
        const province = { 11: '北京', 12: '天津', 13: '河北', 14: '山西', 15: '内蒙古', 21: '辽宁', 22: '吉林', 23: '黑龙江 ', 31: '上海', 32: '江苏', 33: '浙江', 34: '安徽', 35: '福建', 36: '江西', 37: '山东', 41: '河南', 42: '湖北 ', 43: '湖南', 44: '广东', 45: '广西', 46: '海南', 50: '重庆', 51: '四川', 52: '贵州', 53: '云南', 54: '西藏 ', 61: '陕西', 62: '甘肃', 63: '青海', 64: '宁夏', 65: '新疆', 71: '台湾', 81: '香港', 82: '澳门', 91: '国外' }
        if (!province[Number(value.slice(0, 2))]) {
          this.$message.error("身份证号码格式不正确，请重新输入");
          return false
        }
        return true;
      },*/
    }
  }
</script>